<template>
	<view>
		<view class="box">
			<!-- 车辆状态 0=无车辆信息 1=未扫码 2=已扫码 3=已发车 4=待配送 5=已到达 -->
			<view class="box-a">
				<view v-if="index_index_data.status == 1 || !index_index_data.order_info.data"
					style="color: #fff; line-height: 50px;font-size: 30px;" @click="scanCode()">
					<image src="../../static/saoyisao.png"
						style="width: 50px; height: 50px; margin-right: 30px;margin-left: 20px;" mode=""></image> 扫一扫
				</view>

				<h3 v-if="index_index_data.status !=1 &&index_index_data.order_info.data!=null">路由：
					<!-- 					<text v-for="(time,index) in index_index_data.line_info.json_line"
						style="margin-left: 5px;">{{index!=0?' - '+time.outlet_name:time.outlet_name}} </text> -->
					{{truck.addrfrom}} - {{truck.addrto}}
				</h3>
				<view v-if="index_index_data.status !=1 && index_index_data.order_info.data">
					<h3>档口：{{truck.addrfromnode}}</h3>
					<h3 style="margin-left: 20px;">车牌号：{{index_index_data.car_plate}}</h3>
				</view>
			</view>
			<view class="kks">
				<view class="nns">

					<!-- 信息 -->
					<view class="ddlb" v-if="index_index_data.status == 1">
						<p>信息</p>
						<view style="line-height: 50px;">
							<h4>装车单号：{{truck.loadno}}</h4>
							<h4>
								路由：
								<!-- 								<text v-for="(time,index) in index_index_data.line_info.json_line"
									style="margin-left: 5px;">{{index!=0?' - '+time.outlet_name:time.outlet_name}}
								</text> -->
								{{truck.addrfrom}} - {{truck.addrto}}
							</h4>
							<h4>档口：{{truck.addrfromnode}}</h4>
						</view>

						<!-- <button v-if="1" @click="toAddress()">去这里</button> -->

					</view>

					<view class="order-box" v-if="index_index_data.status != 0">
						<!-- 订单列表 -->
						<view class="ddlb nns" v-if="index_index_data.status != 1 ">

							<p>订单列表</p>
							<view class="dd" v-if="index_index_data.order_info.data.length!=0"
								v-for="(time,index) in index_index_data.order_info.data"
								@click="tzxx('/pages/my/d_dingdanxiangqing?id='+time.id)">
								<view class="dd-top">
									<view class="dd-q">
										{{time.tms_order_sn || ''}}
									</view>
									<view class="dd-p" :style="
								time.status == 1 ? 'color:#1890FF;':
								time.status == 2 ? 'color:#CF9200;':
								time.status == 3 ? 'color:#CF9200;':
								time.status == 4 ? 'color:#0ACF00;':''">
										{{time.status_text}}
									</view>
								</view>
								<view class="dd-dd">
									<!-- 是否垫资 0 未垫资 1=垫资 -->
									<p>是否垫付：{{time.is_advance==0?"未垫资":"垫资"}}</p>
									<p>吨数：{{time.all_weight || ''}}吨</p>
									<!-- 是否需要配送 0不需要 1=需要 -->
									<p>是否送货：{{time.is_delivery==0?"不需要":"需要"}}</p>
								</view>
							</view>

							<view class="dd" v-if="index_index_data.order_info.data.length == 0 && !isOrderConfirm">
								<view class="dd-dd" style="line-height: 60rpx;">
									<h4>装车单号：{{truck.loadno}}</h4>
									<h4>
										路由：
										<!-- 										<text v-for="(time,index) in index_index_data.line_info.json_line"
											style="margin-left: 5px;">{{index!=0?' - '+time.outlet_name:time.outlet_name}}
										</text> -->
										{{truck.addrfrom}} - {{truck.addrto}}
									</h4>
									<h4>档口：{{truck.addrfromnode}}</h4>
									<h4>状态：{{index_index_data.status_name}}</h4>
								</view>
							</view>

							<button v-if="index_index_data.status !=1 && index_index_data.status_name == '待发车'"
								@click="waybill_fache()">确认发车</button>
							<button
								v-if="index_index_data.order_info.data.length != 0 &&index_index_data.status !=1 && index_index_data.status_name == '运输中'"
								@click="order_confirm()">确认到达</button>

							<view class="wu" v-if="index_index_data.line_info.length==0">
								<image src="../../static/wu.png" style="width: 182px; height: 150px; " mode=""></image>
								<p>暂无数据</p>
							</view>

						</view>
					</view>
					<view class="order-box" v-else>
						<view class="ddlb nns">
							<p>订单列表</p>
							<view class="wu">
								<p>暂无数据</p>
							</view>
						</view>
					</view>

					<!-- 未申请车费运单 -->
					<view class="ddlb nns">
						<p>未申请车费运单</p>
						<view class="unsettled-list" v-if="carOrder.length >0">
							<view class="unsettled-item" v-for="(item,index) in carOrder" :key="item.id">
								<car-order-item :item="item" @toDetail="toDetailHande" @fareAddApply="fareAddApplyHande"
									@fareApply="fareApplyHande"></car-order-item>
							</view>

						</view>
						<view class="order-box" v-else>
							<view class="ddlb nns">
								<view class="wu">
									<p>暂无数据</p>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="tc" v-if="cp">
			<view class="tc-box">
				<p>填写车牌号</p>
				<p>
					<view>
						<car-number-input @numberInputResult="numberInputResult"
							:defaultStr="defaultNum"></car-number-input>
					</view>
				</p>
				<view style="margin-top: 40px; border-top: 1px solid #EAEAF0;" @click="cpqx">取消</view>
			</view>
		</view>

		<!-- 增加车费申请 -->
		<view class="tc" v-if="showIncreaseFare">
			<fare-apply-item @tocancel="tocancelHande" @toconfirm="toconfirmHande"></fare-apply-item>
		</view>
	</view>
</template>

<script>
	import { cp } from 'fs';
	export default {
		data() {
			return {
				xinxi: 1, //信息
				cp: 0, //弹窗
				//车牌
				chepai: [
					"", "", "", "",
					"", "", "", ""
				],
				chepaijd: [
					true, false, false, false,
					false, false, false, false
				],
				index_index_data: {
					status: 0,
					order_info: {
						data: []
					}
				},
				result: "",
				defaultNum: '',
				delivery_list: [],
				show_need_delivery_order: false,
				page: 1,
				carOrder: [],
				showIncreaseFare: false,
				fareApplyWaybillId: 0,
				fareAddApplyWaybillId: 0,
				isOrderConfirm: false,

				memberid: '', // 物流公司会员号
				accountid: '', // 操作员id
				transferid: '', // 全球通车次id
				transferstatus: '1', // 全球通车次状态 1 装车 2 发车 3 接车
				truck: {}, // 记录车次信息
			}
		},
		onLoad(open) {
			// uni.setStorageSync('token', "63698e02-e47e-45a8-9ddd-75fc5d4d03a8")

			this.index_index() // 首页信息
			this.getCarOrder()

			let that = this

			open.id = '83'
			open.truck =
				`{
		"transferid": "d6844403c29f483899e7cfae795a0427",
		"fromlocation": 371300,
		"addrfrom": "临沂",
		"addrfromnode": "临沂(总部)",
		"addrto": "柳州",
		"tolocation": 450200,
		"addrxhd": "柳州站点",
		"xhd": "9fb47d584afd47748c3e2eea4c5a76d8",
		"loadno": "ZC2409270004",
		"loaddt": "2024-09-27",
		"vehicleid": "4511349e98ff4615997191f3bdd9353e",
		"vehicleno": "鲁QL27z6",
		"vehiclenetweight": 0.0,
		"drivercard": "",
		"vehicleload": 0.0,
		"drivername": "高",
		"drivertel": "13153977666",
		"gpsname": "",
		"handingman": "",
		"handingfee": 0.00,
		"handingfeetype": 0,
		"forkman": "",
		"forkfee": 0.00,
		"forkfeetype": 0,
		"freight1": 0.00,
		"freight1type": 0,
		"freight2": 0.00,
		"freight3": 0.00,
		"insurancefee": 0.00,
		"insurancefeetype": 0,
		"feeremark": "",
		"totaldoccount": 0,
		"totalfreight": 0.00,
		"freightyf": 0.00,
		"freighttf": 0.00,
		"freighthf": 0.00,
		"freightkf": 0.00,
		"freightyj": 0.00,
		"totalGoodsQuantity": 0,
		"totalGoodsVolume": 0.0,
		"totalGoodsWeight": 0.0,
				"detailModel": []
						}`
			this.truck = JSON.parse(open.truck)
			console.log('司机端接收的车次信息 = ', this.truck.transferid);

			if (open && (open.id || open.truck)) {
				uni.setStorageSync('share_id', open.id)
				uni.navigateTo({
					// url: `/pages/index/baobanyuangong?id=${open.id}&truck=${open.truck}`
					url: `/pages/index/tianxiexinxiAB?type=2&share_id=${open.id}&truck=${JSON.stringify(that.truck)}`
				})
			}

			if (!uni.getStorageSync('token')) {
				this.tz("登录")
			} else {
				// this.index_index(); //首页信息
				// this.cars_Info();   //车辆信息
			}
		},

		onPullDownRefresh() {
			this.index_index();
		},
		methods: {

			// 获取车次信息(qqt)
			async getTruckDetail() {
				let that = this
				let res = await this.$rqt.getTrcukDetail({
					memberid: that.memberid,
					accountid: that.accountid,
					transferstatus: that.transferstatus,
					transferid: that.transferid,
				})
				console.log('getTruckDetail.res = ', res);
				that.truck = res.data[0]
				console.log('司机端获取到的车次信息 = ', that.truck);
			},

			//首页
			index_index() {
				let that = this
				this.$rqt.index_index({}).then(res => {
					uni.stopPullDownRefresh();
					this.index_index_data = res.data;
					this.index_index_data.line_info.json_line = JSON.parse(this.index_index_data.line_info
						.json_line) // 档口信息转为json

					this.memberid = res.data.line_info.flight_info.tms_company_id
					this.accountid = res.data.line_info.flight_info.user_tms_id
					this.transferid = res.data.line_info.transferid
					if (res.data.status == '3') that.transferstatus = '3'
					that.getTruckDetail()

					if (this.index_index_data.bond_status == 1) {
						uni.showModal({
							title: '提示',
							content: '请先缴纳保证金',
							showCancel: false,
							success: (res) => {
								if (res.confirm) {
									uni.navigateTo({
										url: '/pages/index/zhufubaozhengjin?id=' + this
											.index_index_data.share_id +
											'&type=2&car_plate=' +
											this.index_index_data.car_plate + '&bond=' +
											this
											.index_index_data.line_info.bond
									})
								}
							}
						});
					}
				})
			},

			numberInputResult(e) {
				// 去除空格
				e = e.replace(/\s*/g, "");
				// 如果车牌输入大于6
				if (e.length > 6) {
					this.index_getlineinfo(e, this.result);
				}
			},
			// 清楚填写车牌的数据
			cpqx() {
				for (let i = 0; i < this.chepai.length; i++) {
					this.chepai[i] = "";
				}
				this.chepaijd[0] = true;
				for (let i = 1; i < this.chepaijd.length; i++) {
					this.chepaijd[i] = false;
				}
				this.cp = 0;
			},
			//定时发送定位
			Carslocation_add() {
				uni.getLocation({
					type: 'wgs84',
					success: (res) => {
						let data = {
							waybill_id: "",
							lot: res.longitude,
							lat: res.latitude
						}
						this.$rqt.Carslocation_add(data).then(res => {
							console.log(res)
						})
					}
				})
			},
			// 导航去这里
			toAddress() {
				// this.getLocation();
				let address = this.index_index_data.line_info.outlet_info.province +
					this.index_index_data.line_info.outlet_info.city +
					this.index_index_data.line_info.outlet_info.area +
					this.index_index_data.line_info.outlet_info.address;
				console.log(address);

				uni.request({
					url: 'https://restapi.amap.com/v3/geocode/geo?parameters',
					method: 'GET',
					data: {
						key: 'e40691a34b3c803e06b5d9842839d2c8',
						address: address
					},
					success: (res) => {
						// console.log('高德res', res.data.geocodes[0])
						let jd = res.data.geocodes[0].location.split(',')[0]
						let wd = res.data.geocodes[0].location.split(',')[1]
						uni.openLocation({
							latitude: Number(wd),
							longitude: Number(jd),
							name: '地址',
							address: address,
							success: function(res1) {},
							fail: function(err) {
								console.log('err: ', err);
							}
						});
					}
				})
			},
			// 扫一扫
			scanCode() {
				// 允许从相机和相册扫码
				uni.scanCode({
					success: (res) => {
						this.result = res.result;
						this.cp = 1;
					}
				});
				// this.index_getlineinfo(,this.result);
				// this.index_getlineinfo();
			},
			//扫一扫填车牌
			index_getlineinfo(x, y) {
				// 隐藏产品输入框
				this.cp = 0;
				let data = {
					car_plate: x,
					muzzle_id: y
				}
				this.$rqt.index_getlineinfo(data).then(res => {
					// data.car_info.car_status // 信息是否完成:1=完整,2=不完整
					let res_data = res.data;
					//填写信息
					if (res.data.car_info.car_status == 2) {
						uni.navigateTo({
							url: "/pages/index/tianxiexinxi?car_plate=" + x + "&muzzle_id=" + y
						});
					}
					//信息
					if (res.data.car_info.car_status == 1) {
						uni.navigateTo({
							url: "/pages/index/xinxi?id=" + res.data.car_info.id + '&json_line=' +
								encodeURIComponent(JSON
									.stringify(res.data.line_info.json_line))
						});
					}
					if (res_data) {
						let car_info = res_data.car_info;
						let car_status = car_info.car_status;
						if (car_status == 0) {
							uni.showToast({ title: "资料不完整", icon: "none", })
						}
					}
				})
			},
			//确认发车
			waybill_fache() {
				this.get_delivery_list()
			},
			//确认发车提交
			waybill_fache_submit() {
				let datad = { id: this.waybill_id }
				this.$rqt.waybill_fache(datad).then(res => {
					uni.showToast({ title: res.msg, icon: 'success', });
					// 刷新页面
					this.index_index();
				})
				console.log("确认发车提交: ");
			},
			//获取需要配送的订单
			get_delivery_list() {
				let hh = this.index_index_data.order_info.data || [];
				if (hh.length <= 0) return
				this.waybill_id = hh[0].waybill_id;
				let data = { id: this.waybill_id }
				this.$rqt.get_delivery_list(data).then(res => {
					console.log("res: ", res);
					this.delivery_list = res.data || [];
					// 如果有需要配送的订单
					if (this.delivery_list.length > 0) {
						this.show_need_delivery_order = true;
						let hh = JSON.stringify(this.index_index_data.order_info.data);
						uni.navigateTo({
							url: "/pages/index/dingdanliebiao?data=" + hh
						});
					} else {
						this.waybill_fache_submit();
					}
				})
			},
			closeModeBox(e) {
				this.show_need_delivery_order = false
			},
			confirmDeliveryOrder(e) {
				this.show_need_delivery_order = false
				// 提交设置需要配送的总运费

				// 提交订单确认不配送
				this.waybill_fache_submit();
				console.log(e);
			},

			//补充司机信息确认
			cars_restock() {
				let data = {
					id: "1",
					name: "",
					card_img: "",
					drive_img: ""
				}
				this.$rqt.cars_restock(data).then(res => {
					console.log(res);
				})
			},
			tzxx(x) {
				// /pages/my/d_dingdanxiangqing
				uni.navigateTo({ url: x })
			},
			// 跳转页面
			tz(x) {
				let url = ""
				if (x == "途中堵车") {
					uni.navigateTo({
						url: "/pages/index/tuzhongduche"
					});
				} else
				if (x == "途中事故") {
					uni.navigateTo({
						url: "/pages/index/tuzhongshigubaobei"
					});
				} else
				if (x == "登录") {
					uni.navigateTo({
						url: '/pages/logon/logon'
					});
				}
			},
			// 车牌
			shuru(e, c) {
				// console.log(this.chepai[c].length);
				console.log(e);

				if (this.chepai[c].length > 1) {
					this.chepai[c] = e.detail.value[0];
				}

				if (this.chepai.length > c)
					if (e.detail.value == '') {
						this.chepaijd[c - 1] = true;
						this.chepaijd[c] = false;
					}
				this.chepaijd[c - 1] = true;

				if (c == 6) {
					// this.cpqx()
					let cp = ""
					for (let i = 0; i < this.chepai.length - 1; i++) {
						cp += this.chepai[i];
					}
					this.index_getlineinfo(cp, this.result);
				}
			},
			// 定位授权
			getLocation() {
				let that = this;
				// 1、判断手机定位服务【GPS】 是否授权
				uni.getSystemInfo({
					success(res) {
						console.log("判断手机定位服务是否授权:", res);
						let locationEnabled = res.locationEnabled; //判断手机定位服务是否开启
						let locationAuthorized = res.locationAuthorized; //判断定位服务是否允许微信授权
						if (locationEnabled == false || locationAuthorized == false) {
							//手机定位服务（GPS）未授权
							uni.showToast({
								title: "请打开手机GPS",
								icon: "none",
							});
						} else {
							//手机定位服务（GPS）已授权
							// 2、判断微信小程序是否授权位置信息
							// 微信小程序已授权位置信息
							uni.authorize({
								//授权请求窗口
								scope: "scope.userLocation", //授权的类型
								success: (res) => {
									// that.fnGetlocation();
								},
								fail: (err) => {
									err = err["errMsg"];
									uni
										.showModal({
											content: "需要授权位置信息",
											confirmText: "确认授权",
										})
										.then((res) => {
											console.log(res);
											if (res[1]["confirm"]) {
												uni.openSetting({
													success: (res) => {
														if (res.authSetting[
																"scope.userLocation"
															]) {
															// 授权成功
															uni.showToast({
																title: "授权成功",
																icon: "none",
															});
															that.fnGetlocation();
														} else {
															// 未授权
															uni.showToast({
																title: "授权失败,请重新授权",
																icon: "none",
															});
															uni.showModal({
																title: "授权",
																content: "获取授权" +
																	authouName +
																	"失败,是否前往授权设置？",
																success: function(
																	result
																) {
																	if (result
																		.confirm
																	) {
																		uni
																			.openSetting();
																	}
																},
																fail: function() {
																	uni.showToast({
																		title: "系统错误！",
																		icon: "none",
																	})
																},
															});
														}
													},
												});
											}
											if (res[1]["cancel"]) {
												// 取消授权
												uni.showToast({
													title: '你拒绝了授权,无法获得周边信息',
													icon: 'none'
												})
											}
										})
								},
								complete(res) {
									// console.log('授权弹框', res);
									if (res.errMsg == "authorize:ok") {
										that.fnGetlocation()
									} else {
										uni.showModal({
											title: "授权",
											content: "获取授权" + authouName + "失败,是否前往授权设置？",
											success: function(result) {
												if (result.confirm) {
													uni.openSetting()
												}
											},
											fail: function() {
												uni.showToast({ title: '系统错误!', icon: 'none' })
											},
										});
									}
								},
							});
						}
					},
				});
			},
			// 定位获取
			fnGetlocation() {
				let that = this;
				uni.getLocation({
					type: "wgs84", //默认为 wgs84 返回 gps 坐标
					geocode: "true",
					isHighAccuracy: "true",
					accuracy: "best", // 精度值为20m
					success: function(res) {
						console.log("定位获取:", res);
						let platform = uni.getSystemInfoSync().platform;
						if (platform == "ios") {
							//toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。
						} else {

						}
					},
					fail(err) {
						if (
							err.errMsg ===
							"getLocation:fail 频繁调用会增加电量损耗，可考虑使用 监听地理位置变化"
						) {
							uni.showToast({ title: "请勿频繁定位", icon: "none", })
						}
						if (err.errMsg === "getLocation:fail auth deny") {
							// 未授权
							uni.showToast({ title: "无法定位，请重新获取位置信息", icon: "none", })
							authDenyCb && authDenyCb();
							that.isLocated = false;
						}
						if (
							err.errMsg ===
							"getLocation:fail:ERROR_NOCELL&WIFI_LOCATIONSWITCHOFF"
						) {
							uni.showModal({ content: "请开启手机定位服务", showCancel: false, })
						}
					},
				});
			},
			getCarOrder() {
				this.$rqt.getCarOrder({}).then(res => {
					console.log('res: ', res);
					if (res.code == 1) {
						let data = res.data?.data || [];
						this.carOrder = data;
					}
				})
			},
			toDetailHande(e) {
				console.log('e: ', e);
			},
			fareAddApplyHande(e) {
				let { waybill_id } = e;
				this.fareAddApplyWaybillId = waybill_id;
				this.showIncreaseFare = true;
			},

			fareApplyHande(e) {
				let { waybill_id } = e;
				this.fareApplyWaybillId = waybill_id;
			},
			fareApplyHande(e) {
				console.log('fareApplyHande.2.执行了.e: ', e)
				let { waybill_id, freight } = e
				uni.navigateTo({
					url: "/pages/my/a_xuanzezhanghu?id=" + waybill_id + "&bond_amount=" + freight + "&name=chefei"
				})
			},

			tocancelHande(e) {
				this.showIncreaseFare = false;
			},
			toconfirmHande(e) {
				this.showIncreaseFare = false;
				this.addFreightAmount(e);
			},
			addFreightAmount(e) {
				let data = {
					waybill_id: this.fareAddApplyWaybillId,
					amount: e.amount,
					remark: e.remark,
				}
				console.log('data: ', data);
				this.$rqt.freightaddAmount(data).then(res => {
					let { msg } = res;
					uni.showToast({ title: msg })
					this.getCarOrder();
				})
			},
			// 订单确认到达
			order_confirm() {
				let t_data = this.index_index_data.order_info?.data;
				console.log('t_data: ', t_data);
				let t_data_lenght = t_data.length;
				if (t_data_lenght < 1) {
					return
				}
				let data = {
					order_id: t_data[0].id || 0,
				}
				console.log('data99: ', data);

				this.$rqt.order_confirm(data).then(res => {
					console.log(res);
					uni.showToast({ title: res.msg, icon: "success", duration: 850 })
					this.index_index_data.order_info.data = []
					this.isOrderConfirm = true
					// this.index_index()
					this.getCarOrder()
					// 设置有确认送达订单
					this.setOrderConfirmFlag()
				})
			},
			setOrderConfirmFlag() {
				try {
					uni.setStorageSync('OrderConfirmFlag', '1');
					console.log('setOrderConfirmFlag');
				} catch (e) {

				}
			}
		}
	}
</script>

<style scoped>
	.wu {
		width: 100%;
		text-align: center;
		padding-top: 60px;
		color: #999999;
		font-size: 18px;
		line-height: 40px;
	}

	.tc-box>view {
		line-height: 60px;

		text-align: center;
		font-size: 18px;
		font-weight: 400;
		color: #686870;
	}

	.tc-box>p {
		font-size: 22px;
		font-weight: 500;
		color: #333539;
		text-align: center;
	}

	.tc-box>p>view {
		/* width: 80%;
		margin: 0 auto;
		margin-top: 30px;
		display: flex;
		justify-content: space-around; */
	}

	.tc-box>p>view>input {
		width: 28px;
		height: 32px;
		background: #FFFFFF;
		border-radius: 4px;
		border: 1px solid #CCCCCC;
	}

	.tc-box {
		padding-top: 10rpx;
		width: 343px;
		height: 230px;
		background: #FFFFFF;
		border-radius: 18px;
		margin: 0 auto;
		margin-top: 200rpx;
	}

	.tc {
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background: rgba(0, 0, 0, 0.2);
	}

	/* 订单列表 */
	.ddlb {
		padding-bottom: 20px;
		width: 100%;
	}

	.ddlb>p {
		border-left: 3px solid #1890FF;
		font-size: 22px;
		font-weight: 600;
		padding-left: 10px;
		margin-top: 20px;
		color: #1890FF;
	}

	.ddlb>button {
		margin-top: 20px;
		width: 100%;
		height: 50px;
		background: #1890FF;
		box-shadow: 0px 0px 4px 0px rgba(204, 204, 204, 0.5);
		border-radius: 8px;
		color: #fff;
	}

	.dd {
		margin-top: 12px;
		width: 100%;
		padding-bottom: 10px;
		background: #FFFFFF;
		box-shadow: 0px 0px 6px 0px rgba(204, 204, 204, 0.5);
		border-radius: 8px;
	}

	.dd-top {
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px dashed #CCCCCC;
	}

	.dd-q {
		font-size: 18px;
		font-weight: 500;
		margin-left: 20px;
		line-height: 50px;
	}

	.dd-p {
		font-size: 18px;
		font-weight: 600;
		color: #1890FF;
		line-height: 50px;
		margin-right: 20px;
	}

	.dd-dd {
		overflow: hidden;
		width: 90%;
		margin: 0 auto;
	}

	.dd-dd>p {
		line-height: 40px;
		float: left;
		width: 50%;
		font-size: 16px;
		font-weight: 400;
	}

	.kks {
		background-color: #fff;
		width: 100%;
		border-radius: 12px 12px 0px 0px;
		padding-top: 10px;
		margin-top: 20px;
	}

	.nns {
		width: 95%;
		margin: 0 auto;
	}

	.kks-box {
		width: 100%;
		display: flex;
		justify-content: space-between;
	}

	.kks-box>view>image {
		width: 100%;
		height: 100%;
	}

	.kks-box>view {
		width: 48%;
		color: #fff;
		border-radius: 5px;
		height: 100px;
		/* background-color: #1890FF; */
		position: relative;
	}

	.kks-box>view>p {
		position: absolute;
		left: 0;
		top: 0;
		margin-left: 10px;
		margin-top: 10px;
		font-size: 18px;
		font-weight: 600;
	}

	.box-a {
		width: 90%;
		margin: 0 auto;
		margin-top: 20px;
	}

	.box>.box-a>view {
		display: flex;
	}

	.box>.box-a>h3,
	.box>.box-a>view>h3 {
		color: #fff;
		line-height: 30px;
		font-weight: 500;
	}

	/* box */
	.box {
		border-top: 1px solid #fff;
		background-color: #1890FF;
		width: 100%;
		overflow: hidden;
	}

	.mode-box {
		position: fixed;
		top: 0;
		left: 0;
		background-color: #f4f4f5;
		width: 100%;
		height: 100%;
	}

	.unsettled-list {}
</style>